<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我睡不醒</title>
    <link rel="stylesheet" href="style.css">
    <link rel="icon" href="团队LOGO.png" type="image/x-icon">
    <meta name="anthor" content="SHUIBUXING">
    <meta name="keywords" content="团队作品集，团队网站，设计作品，我睡不醒，UI/UX，交互设计">
</head>

<body>
    <div class="nav">
        <input type="checkbox">
        <span></span>
        <span></span>
        <div class="menu">
            <li><a href="#home">home</a></li>
            <li><a href="#about">about</a></li>
            <li><a href="#works">works</a></li>

            <li><a href="#contact">contact</a></li>

        </div>
    </div>
    <header>
        <div>
            <div class="dingwei">
                <div class="biaoti">
                    WEB
                    <br> DESIGN
                </div>
            </div>
            <div class="shouye">
                <h1 class="biaotitwo" id="home">我睡不醒</h1>
                <img src="文字 -2.png" alt="" class="wenzi">
                <h2 class="biaotithree">HTML</h2>
                <hr class="hrone">

                <div class="jianjie">
                    我们的组名灵感简单易懂 <br><br> 因为大家出来做HTML作业 <br> 的时候是一个晴空万里 <br> （不是）的早晨，但是真 <br>的睡不醒睡不醒睡不醒...
                    <i></i>
                </div>
                <img src="10623.jpg" alt="" class="shouyeone">
                <img src="15691.jpg" alt="" class="shouyetwo">
                <img src="0011.jpg" alt="" class="shouyethree">
                <img src="15610.jpg" alt="" class="shouyefour">
            </div>
        </div>
        <div class="dafense">
            <div class="xiaofense">
                <div class="huise">

                </div>
            </div>
        </div>
    </header>
    <div class="tuanduijieshao">
        <div class="dise">
            <img src="睡不醒.jpg" alt="" class="shuibuxing">
        </div>
        <br>
        <hr>
        <br>
        <br>
        <div class="beijing">
            <img src="pink.jpg" alt="" class="picsix">
            <br>
            <br>
            <div class="jieshao" id="about">
                <h3>团队介绍

                </h3>
                <div class="biaotibeijing">Team Introdution</div>
                <br>
                <div class="zipai">
                    <a href="http://xie-wenli.gitee.io/personal-website" target="blank"><img src="谢玟莉.jpg" alt="" class="xie"></a>
                    <a href="http://uanuanhuan.gitee.io/personnal-website" target="blank"><img src="胡欢.jpg" alt="" class="hu"></a>
                    <a href="http://zhao-ni.gitee.io/personal-website/" target="blank"><img src="赵倪.jpg" alt="" class="zhao"></a>
                    <a href="http://zhang-zhangxy.gitee.io/final-project-" target="blank"><img src="张昕瑶.jpg" alt="" class="zhang"></a>
                </div>
                <p class="xieone">谢玟莉
                    <br> 女
                    <br> 19岁
                    <br> 天秤座
                </p>

                <p class="huone">胡欢
                    <br> 女
                    <br> 19岁
                    <br> 白羊座
                </p>

                <p class="zhaoone">赵倪
                    <br> 女
                    <br> 19岁
                    <br> 射手座
                </p>

                <p class="zhangone">张昕瑶
                    <br> 女
                    <br> 19岁
                    <br> 双鱼座
                </p>
            </div>
            <ul class="box">
                <li>
                    <img src="自拍 (1).jpg" alt="" style="width: 700px;height: 320px;">
                    <div class="text">SHUIBUXING</div>
                </li>
                <li>
                    <img src="自拍 (2).jpg" alt="" style="width: 700px;height: 320px;">
                    <div class="text">SHUIBUXING</div>
                </li>
                <li>
                    <img src="自拍 (3).jpg" alt="" style="width: 700px;height: 320px;">
                    <div class="text">SHUIBUXING</div>
                </li>
                <li>
                    <img src="自拍 (4).jpg" alt="" style="width: 700px;height: 320px;">
                    <div class="text">SHUIBUXING</div>
                </li>
                <li>
                    <img src="自拍 (5).jpg" alt="" style="width: 700px;height: 320px;">
                    <div class="text">SHUIBUXING</div>
                </li>
            </ul>
            <div class="zuopin" id="works">
                <h3 class="zuopinp">团队作品

                </h3>
                <div class="tuanduidise">Team Works</div>
            </div>

            <body>
                <div class="container">
                    <div class="img img1"></div>
                    <div class="img img2"></div>
                    <div class="img img3"></div>
                    <div class="img img4"></div>
                    <div class="img img5"></div>
                    <div class="img img6"></div>
                    <!-- <div class="img img7"></div> -->
                </div>

            </body>
            <div class="footer" id="contact">
                <div class="top">
                    <h3>CONTACT</h3>
                    <div class="dabox">
                        <a href="#" target="blank"><img src="weibo.png" alt="" class="boxx"></a>
                        <a href="#" target="blank"><img src="weixin.png" alt="" class="boxx"></a>
                        <a href="#" target="blank"><img src="QQ.png" alt="" class="boxx"></a>
                        <a href="#" target="blank"><img src="email.png" alt="" class="boxx"></a>
                    </div>
                </div>

                <div class="bottom">
                    Copyright 2020 All Rights Reserved @SHUIBUXING
                </div>
            </div>
        </div>
    </div>

    </div>
</body>

</html>